<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link href="css/mui.min.css" rel="stylesheet" />
		<script src="js/mui.min.js"></script>
		<script src="js/app.js"></script>
		<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
	</head>

	<body>
		<form class="mui-input-group" id="infoForm">
			<input type="hidden" name="thumpic" id="thumpicvalue" />
			<input type="hidden" name="top" id="topvalue" />
			<div class="mui-input-row">
				<label>标题</label>
				<input type="text" class="mui-input-clear" name="title" placeholder="请输入标题">
			</div>
			<div class="mui-input-row">
				<label>置顶</label>
				<div class="mui-switch mui-switch-mini" id="topinfo">
					<div class="mui-switch-handle"></div>
				</div>
			</div>
			<div class="mui-input-row">
				<label>缩略图</label>
				<div class="mui-switch mui-switch-mini" id="thumpic">
					<div class="mui-switch-handle"></div>
				</div>
			</div>
			<div>
				<textarea id="textarea" rows="15" placeholder="请输入内容" name="content"></textarea>
			</div>
			<div class="mui-button-row">
				<button type="button" class="mui-btn mui-btn-primary" onclick="add()">确认</button>
				<button type="button" class="mui-btn mui-btn-danger">取消</button>
			</div>
		</form>
	</body>
	<script>
		document.getElementById("thumpic").addEventListener("toggle", function(event) {
			if(event.detail.isActive) {
				var lfs = [];
				plus.gallery.pick(function(path) {
					lfs = path.files;
					var task = plus.uploader.createUpload("http://hs.tunnel.javano.cn/upload/thum", {
						method: "post"
					}, function(t, status) {
						if(status == 200) {
							console.log(t.responseText);
							document.getElementById("thumpicvalue").value = t.responseText;
							alert("图片上传成功");
							mask.close(); //关闭遮罩
						} else {
							alert("图片上传失败");
						}
					});
					task.addData("type", "thum");
					task.addFile(lfs[0], {
						key: "thum"
					});
					task.start();
					var mask = mui.createMask(function(){}); //callback为用户点击蒙版时自动执行的回调；
					mask.show(); //显示遮罩
				}, function(e) {
					console.log("取消图片！");
				}, {
					filter: "none",
					multiple: true,
					maximum: 1,
					system: false,
					onmaxed: function() {
						plus.nativeUI.alert('最多选择一张缩略图，大小建议100*100')
					},
					popover: true,
					selected: lfs
				});
			}
		})

		document.getElementById("topinfo").addEventListener("toggle", function(event) {
			if(event.detail.isActive) {
				console.log("你启动了开关");
				document.getElementById("topvalue").value = 1;
			} else {
				console.log("你关闭了开关");
				document.getElementById("topvalue").value = 0;
			}
		})

		function add() {
			var data = $("#infoForm").serialize();
			console.info(data);
			var state = app.getState();
			if(state.account != null) {
				mui.post('http://hs.tunnel.javano.cn/addInfo/' + state.account, data, function(result) {
					alert(result);
					mui.openWindow({
						"id": new Date(),
						"crateNew": false,
						"url": "tab1.html",
						"styles": {
							top: '45px', //mui标题栏默认高度为45px
							bottom: '50px' //默认为0px，可不定义
						}
					});
				}, 'text')
			}
		}
	</script>

</html>